<%+header%>

<script type="text/javascript">//<![CDATA[

	timer = 3000;
  String.prototype.startsWith = function (str){
    return this.indexOf(str) == 0;
  };

	function gotopath(obj)
	{
		document.getElementById("cmd").value ="cd " + obj.innerHTML;
		update_status();

	}
	var iwxhr = new XHR();
	
	function read_output(e){
		iwxhr.get('<%=luci.dispatcher.build_url("admin", "system", "cmd_read")%>', {cmd: document.getElementById("cmd").value,path:document.getElementById("currentpath").innerHTML  },
			function(x, ifc)
			{
				obj = document.getElementById("screen");
				obj.value+=ifc[0];
				obj.scrollTop = obj.scrollHeight;
				document.getElementById("cmd").focus();
				setTimeout("read_output()",timer);
			}
		)


	}

	function update_status(e) {
		if(e!=null && e.keyCode!=13) return false;
		obj = document.getElementById("screen");
		obj.value+="\r\n--------------------------------------------\r\n"+document.getElementById("currentpath").innerHTML+"# "+document.getElementById("cmd").value+"\r\n--------------------------------------------\r\n";
		
		iwxhr.get('<%=luci.dispatcher.build_url("admin", "system", "cmd_run")%>', {cmd: document.getElementById("cmd").value,path:document.getElementById("currentpath").innerHTML  },
			function(x, ifc)
			{
				obj = document.getElementById("screen");
				obj.value+=ifc[0];
				document.getElementById("currentpath").innerHTML=ifc[1];;
				document.getElementById("list").innerHTML="<ul><li onclick='gotopath(this)'>..</li><li onclick='gotopath(this)'>"+ifc[2].replace(/,/g,"</li><li onclick='gotopath(this)'>")+"</li></ul>";
				obj.scrollTop = obj.scrollHeight;
				document.getElementById("cmd").focus();
			}
		)
		document.getElementById("cmd").value = "";
	return false;
	};
//]]></script>

<style>
#list ul li
{
	margin-right:10px;
	height:16px;
	display:block;
	float:left;
	word-break: keep-all;
}
#list ul li:hover
{
	background:blue;
	cursor:pointer;
}
#screen{
	SCROLLBAR-FACE-COLOR: #333333;
	SCROLLBAR-HIGHLIGHT-COLOR: #333333;
	SCROLLBAR-SHADOW-COLOR: #000000;
	SCROLLBAR-3DLIGHT-COLOR: #000000;
	SCROLLBAR-ARROW-COLOR: #cccccc;
	SCROLLBAR-TRACK-COLOR: #cccccc;
	SCROLLBAR-DARKSHADOW-COLOR: #000000;
	SCROLLBAR-BASE-COLOR: #cccccc;
	width:100%;height:600px;overflow-y:auto;font-size:12px;margin:0px;border:0px;background:black;color:#CCCCCC;overflow-x:hidden;
}

</style>
<div style="background-color:black;width:100%;color:#CCCCCC;">
	<textarea id="screen"></textarea>
	<table width="100%"><tr>
		<td width="1" nowrap="nowrap" id="currentpath" style="color:#CCCCCC;"></td>
		<td width="1" nowrap="nowrap" style="color:#CCCCCC;">#</td>
		<td>
	<input type="text" id="cmd" onkeypress="update_status(event)" style="margin-top:0px;border:0px;width:100%;margin-left:0px;background:black;color:#CCCCCC" />
		</td>
	</tr></table>
</div>
<div><strong>Files List:</strong></div>
<div id="list"></div>
<script>
update_status(null);
setTimeout("read_output()",timer);
</script>
<%+footer%>
